
<div id="welcome" class="hero-unit hide" style="padding-left: 70px;">
    <button type="button" class="close" onclick="welcomeClose();" aria-hidden="true">&times;</button>
    <h1 id="welcome-title">{{ _( "Hello!" ) }}</h1>
    <p id="welcome-message">{{ _( "You seem to be on your first visit." ) }}</p>
    <a id="btn-learnmore" class="btn btn-primary btn-large">{{ _( "Learn more" ) }}</a>
</div>

<div id="notice" class="well">
    <label for="notice-content" class="fluid-down-control">
        <i class="icon icon-chevron-right"></i> <b>{{ _( "Notice" ) }} ({{ _( "click to view" ) }})</b>
    </label>
    <ul id="notice-content" style="display:none; overflow:auto; width:auto; height:auto; max-height:200px; list-style-type:circle"></ul>
    <!--<svg height="16" version="1.1" viewBox="0 0 14 16" width="14"><path fill-rule="evenodd" d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 0 1 1.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"></path></svg>-->
    <br/>
</div> <!-- #notice -->

<div id="about">
    <div class="row-fluid">
        <div class="span3"><strong>{{ _( "Version" ) }}</strong></div> <!-- .span4 -->
        <div class="span7" id="about_current_version"> </div> <!-- .span8 -->
    </div> <!-- .div.fluid -->
    <div class="row-fluid">
        <div class="span3"><strong>{{ _( "Project main page" ) }}</strong></div> <!-- .span4 -->
        <div class="span3"><a href="https://github.com/XX-net/XX-Net" target="_blank">XX-Net@GitHub</a></div> <!-- .span8 -->
        <div class="span3"><a href="https://gitlab.com/XX-net/XX-Net" target="_blank">XX-Net@GitLab</a></div> <!-- .span8 -->
    </div> <!-- .div.fluid -->
    <div class="row-fluid">
        <div class="span3"><strong>{{ _( "Official Web Site" ) }}</strong></div> <!-- .span4 -->
        <div class="span4"><a href="https://xx-net.com" target="_blank">https://xx-net.com</a></div> <!-- .span8 -->
    </div> <!-- .div.fluid -->
    <div class="row-fluid">
        <div class="span3"><strong>{{ _( "Telegram group" ) }}</strong></div> <!-- .span4 -->
        <div class="span4"><a href="https://t.me/xxnetshare" target="_blank">https://t.me/xxnetshare</a></div> <!-- .span8 -->
    </div> <!-- .div.fluid -->
    <div class="row-fluid">
        <div class="span3"><strong>{{ _( "Telegram Channel" ) }}</strong></div> <!-- .span4 -->
        <div class="span5"><a href="https://t.me/XXNETCHANNEL" target="_blank">https://t.me/XXNETCHANNEL</a></div> <!-- .span8 -->
    </div> <!-- .div.fluid -->
    <div class="row-fluid">
        <div class="span3"><strong>{{ _( "Bug feedback" ) }}</strong></div> <!-- .span4 -->
        <div class="span8">
            <a href="https://github.com/XX-net/XX-Net/issues" target="_blank">GitHub@XX-Net/Issues</a>
            ({{ _( "When submitting a bug, please attach " ) }}<a href="http://127.0.0.1:8085/?module=gae_proxy&menu=status" target="_blank">{{ _( "the status page " ) }}</a>{{ _( "info and " ) }}<a href="http://127.0.0.1:8085/?module=gae_proxy&menu=logging" target="_blank">{{ _( "the log page " ) }}</a>{{ _( "contents" ) }})
        </div> <!-- .span8 -->
    </div> <!-- .div.fluid -->
    <div class="row-fluid">
        <div class="span3"><strong>Wiki</strong></div> <!-- .span4 -->
        <div class="span8">
            <a href="https://github.com/XX-net/XX-Net/wiki" target="_blank">GitHub/XX-Net/Wiki</a>
        </div> <!-- .span8 -->
    </div> <!-- .div.fluid -->
    <div class="row-fluid">
        <div class="span3"><strong>Twitter</strong></div> <!-- .span4 -->
        <div class="span8">
            <a href="https://twitter.com/XXNetDev" target="_blank">@XXNetDev</a>
        </div> <!-- .span8 -->
    </div> <!-- .div.fluid -->
    <div class="row-fluid">
        <div class="span3"><strong>{{ _( "Collect debug info" ) }}</strong></div> <!-- .span4 -->
        <div class="span8">
            <a href="/log_files" target="_blank">
                <button class="btn btn-primary ladda-button" data-style="slide-up" id="check-new-version">{{ _( "Download" ) }}</button>
            </a>
        </div> <!-- .span8 -->
    </div> <!-- .div.fluid -->
</div> <!-- #about -->


<div id="thanks">
    <h3>{{ _( "Thanks to the following projects" ) }}</h3>
    <ol>
        <li>GoAgent</li>
        <li>fqrouter</li>
        <li>Xndroid</li>
        <li>goagentfindip</li>
        <li>GoGoTester</li>
        <li>EasyGoAgent</li>
        <li>Cloudflare</li>
        <li>Google</li>
    </ol>
</div> <!-- #thanks -->
<!-- JavaScript -->
<script type="text/javascript">
    title('{{ _( "About" ) }} {{ _( "APP_NAME" ) }}');
</script>
<script type="text/javascript">
    var pageRequests = {
        'cmd': 'get_version'
    };
    $.ajax({
        type: 'GET',
        url: '/config',
        data: pageRequests,
        dataType: 'JSON',
        success: function (result) {
            document.getElementById("about_current_version").appendChild(document.createTextNode(result['current_version']));
        }
    });

    $('#notice').click(function () {
        if ($('#notice-content', this).html() == '') {
            getNotice();
        }
    });

</script>
